<template>
    <div class="div_top">
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white" :show-indicators="false">
            <van-swipe-item v-for="(item ,image) in Listbanner" :key="image"><img :src="item.img"
                    alt=""></van-swipe-item>
        </van-swipe>
        <van-icon @click="removeItem" class="icon_456X1" name="setting" />
        <van-icon class="icon_457X1" name="service" />
        <van-icon class="icon_462X1" name="bell" />
        <div class="image_207X1">
            <img :src="UseImgsrc" alt="">
        </div>
        <div class="text_1261X1">{{useName}}</div>
    </div>
</template>
<script setup>
import { useMySwipe } from '@/hooks/useMy'
const { useName,UseImgsrc,Listbanner, removeItem} = useMySwipe()



</script>
<style lang="scss" scoped>
::v-deep.van-tabbar-item__text {
    color: #505050;
    font-size: 29px;
}

.div_top {
    position: relative;
}

.van-swipe-item img {
    // object-fit: contain;
    width: 100%;
    height: 177px;
}

.icon_456X1 {
    width: 50px;
    height: 50px;
    left: 33px;
    top: 27px;
    position: absolute;
    font-size: 50px;
    color: #a6a6a6;
    z-index: 999;
}

.icon_457X1 {
    width: 50px;
    height: 50px;
    left: 574px;
    top: 27px;
    position: absolute;
    font-size: 50px;
    color: #a6a6a6;
    z-index: 99;
}

.icon_462X1 {
    width: 50px;
    height: 50px;
    left: 666px;
    top: 28px;
    position: absolute;
    font-size: 50px;
    color: #a6a6a6;
    z-index: 99;
}

.image_207X1 {
    width: 133px;
    height: 133px;
    position: absolute;
    left: 308px;
    top: 108px;
    border-radius: 68px;
    z-index: 99;
    background-color: red;
    overflow: hidden;
}

.image_207X1 img {
    width: 133px;
    height: 254px;
    // overflow: hidden;
    position: absolute;
    top: -60px;
}

.text_1261X1 {
    width: 131px;
    height: 44px;
    position: absolute;
    left: 306px;
    top: 258px;
    color: #383838;
    font-size: 29px;
    line-height: 150%;
    text-align: center;
    font-weight: bold;
    z-index: 99;
}
</style>